import React,{ Component } from 'react'
import { connect } from 'react-redux'
import { Modal,Tabs,message } from 'antd';
import LoginForm from './HomeModal/LoginForm'
import RegisterForm from './HomeModal/RegisterForm'

const TabPane = Tabs.TabPane

class HomeModal extends Component {

  handleCancel = () => {
    if(this.props.home.login === false)message.error('您尚未登录!')
  }

  componentWillUpdate(nextProps, nextState){
    if(nextProps.home.login === false)message.error(nextProps.home.msg)
    else if (nextProps.home.login === true)message.success(nextProps.home.msg)
  }

  render() {
    return (
      <div>
      <Modal
        title="如果您未登录！"
        visible={!this.props.home.login}
        onCancel={this.handleCancel}
        footer={[]}
      >
      <Tabs defaultActiveKey="1" tabPosition="left">
      <TabPane tab="登录" key="1"><LoginForm dispatch={this.props.dispatch}/></TabPane>
      <TabPane tab="注册" key="2"><RegisterForm /></TabPane>
      <TabPane tab="忘记密码？" key="3"><RegisterForm /></TabPane>
      </Tabs>
      </Modal>
      </div>
    )
  }
}

const mapStateToProps = (state) => {
  return {
    home: state.home
  }
}

export default connect(mapStateToProps)(HomeModal)
